/**
 * Created by wangzih on 2015/1/23.
 * 右键菜单一些注意的地方
 * 1.给某个元素赋值的时候，记得那个元素的右键事件要return false 不然浏览器默认的会出来
 * 2.***右键菜单的右键事件 也要 retuan flase 不然可能不出来
 */

/**
 * @param wnd
 * @param width 每个框框的宽高
 * @param height
 * @param arrs 按顺序加入数组 --代表横线
 * @constructor
 */
function Menu(wnd, width, height, arrs) {
    this.wnd = wnd;
    this.doc = wnd.document;
    this.w = width;
    this.h = height;
    this.arrs = arrs;
    this.length = 0;
    this._initMenu();
    this._removeMenu();
}

Menu.prototype._initMenu = function () {
    this.bodydiv = this.doc.createElement("div");
    this.bodydiv._sancomponent =this;
//    this.bodydiv.oncontextmenu = function(){
//    	//return false;
//    }
    for(var j in this.arrs){
    	 this.length++;
    }
    this.bodydiv.style.zIndex = "9999";
    this.bodydiv.style.position = "absolute";
    this.contenttable = this.doc.createElement("table");
    this.contenttable.setAttribute("cellpadding","0");
    this.contenttable.setAttribute("cellspacing","0");
    this.contenttable.style.background="white";
    var evt_click = function (self){
    	if(this.clickevent){
    		this.clickevent();
    	}
    	self.bodydiv.style.display = "none";
    };
    for(var i = 0; i < this.length; i++){
        this[i + "tr"] = this.contenttable.insertRow(-1);
        this[i + "td"] = this[i + "tr"].insertCell(-1);
        this[i + "td"].onmouseover=function(){
            this.style.background="#4281F4";
        }
        this[i + "td"].onmouseout=function(){
            this.style.background="white";
        };
        this[i + "td"].onclick = evt_click.bind(this[i + "td"],this);
//     this[0 + "td"].onmouseover=null;
//     this[0 + "td"].onmouseout = null;
//     this[0 + "td"].style.background = "#E1E1E0";
//     this[0 + "td"].onclick=function(){
//    	 return false;
//     };
        	
    }
    var i = 0;
    for (var j  in this.arrs) {
        var current = this.arrs[j];
            this[i + "td"].style.width = this.w!=null?this.w+"px":"150px";
            this[i + "td"].style.textAlign = "center";
            this[i + "td"].style.borderLeft = "1px solid #BABABA";
            this[i + "td"].style.borderRight = "1px solid #BABABA";
            if (j == "--") {
                this[i + "td"].style.height = "0px";
                var m=i+1;
                var n=i-1;
                if(i==0){
                    this[m + "td"].style.borderTop = "1px solid #BABABA";
                }else if(i==this.length-1){
                    this[n + "td"].style.borderBottom = "1px solid #BABABA";
                }else{
                    this[m + "td"].style.borderTop = "1px solid #BABABA";
                    this[n + "td"].style.borderBottom = "1px solid #BABABA";
                }
            } else {
                this[i + "td"].innerText = j;
                this[i + "td"].style.height = this.h==null?"30px":this.h+"px";
                if(typeof current == "function"){
                	this[i + "td"].clickevent = current;
                }else{
                	this[i+"td"]._menu = new Menu(this.wnd,this.w,this.h,current);
                	this[i+"td"].onmouseover =function(obj,i){
                		obj.style.background="#4281F4";
                		var left = parseInt(this.bodydiv.style.left);
                		var top = parseInt(this.bodydiv.style.top);
                		var event = {
                				clientX:left+this.w,
                				clientY:top+this.h*i
                		}
                		obj._menu.createOnCursor(event);
                	}.bind(this,this[i+"td"],i);
                	this[i+"td"].onmouseout = function(obj,i){
                		obj.style.background="white";
                		obj._menu.hidden();
                	}.bind(this,this[i+"td"],i)
                }
            }
        i++;
    }
    this[0 + "td"].style.borderTop = "1px solid #BABABA";
    this[(this.length-1) + "td"].style.borderBottom = "1px solid #BABABA";
    this.bodydiv.appendChild(this.contenttable);
    this.doc.body.appendChild(this.bodydiv);
    this.bodydiv.style.display = "none";
};
Menu.prototype.createOnCursor = function(event){
	var e = event || window.event;
	this.bodydiv.style.display = "block";
    this.bodydiv.style.left = e.clientX + "px";
    this.bodydiv.style.top = e.clientY + "px";
};

/**
 * 给第i个上事件 i从0开始
 * @param i
 * @param func
 */
Menu.prototype.setItemOnclick=function(i,func){
    this[i+"td"].onclick=func;
    this.bodydiv.style.display = "none";
};
Menu.prototype.hidden = function (e){
	if (e) {
		var getE = _getMouseEventSanComponent(e, Menu);
		if (getE) {
			var target = e.srcElement || e.target;
			target.click();
		}
	} else {
		this.bodydiv.style.display = "none";
	}
};
Menu.prototype._removeMenu=function(){
    this.doc.body.addEventListener("mousedown",function(){
    	var e = event || window.event;
    	this.hidden(e);
//    	var target = e.srcElement;
//    	for(var i =0;i<this.length;i++){
//    		if(target == this[i +"td"]){
//    			target.click();
//    			return;
//    		}
//    	}
    	  
    }.bind(this),false);
};

